<!DOCTYPE html>
<html lang="en"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.thymeleaf.org"
      layout:decorator="layout/m_master">

<div layout:fragment="content">

    <div class="page-group">
        <div class="page page_voice_index">
            <div th:replace="layout/m_layout::m_top_nav"></div>
            <div class="head-search-wrap">
                <div class="head-search">
                    <a th:class="${reqParam.orderBy eq '' or reqParam.orderBy eq null ?'active':''}"
                       href="?orderBy=">推荐</a>
                    <a th:class="${reqParam.orderBy eq 'news' ?'active':''}" href="?orderBy=news">最新</a>
                    <a th:class="${reqParam.orderBy eq 'hot' ?'active':''}" href="?orderBy=hot">最热</a>
                    <a th:class="${reqParam.orderBy eq 'city' ?'active':''}" href="?orderBy=city">同城</a>
                    <div class="searchbtn" data-panel="#panel_voice_index"><i class="icon-bottlecms-19"></i> 筛选</div>
                </div>
            </div>
            <!--s: 底部导航 -->

            <div th:replace="layout/m_layout::m_nav"></div>
            <!--e: 底部导航 -->

            <div class="page-content infinite-scroll">
                <div class="bcui-infinite" page="1">
                    <div class="bcui-infinite-list voice-list" pages-current="1"
                         pages-src="/m/ajax/voice/list" style="background:#FFF;">
                    </div>
                    <div class="bcui-infinite-preloader" status="end">
                        <div class="bcui-flow-more"><font>加载更多</font></div>
                        <div class="bcui-flow-loading"></div>
                        <div class="bcui-flow-end"><font>没有了～</font></div>
                        <div class="bcui-flow-nothing"><font>没有找到相关数据！</font></div>
                    </div>
                </div>

            </div>
            <div th:if="${!isVip}">
                <div th:replace="layout/m_layout::vip"></div>
            </div>
        </div>
        <div class="panel-overlay"></div>
        <div class="panel panel-right panel-reveal theme-dark panel_voice_index search-window-right"
             id="panel_voice_index">
            <div class="content-block">
                <form action="/m/voice" method="get" id="search">
                    <input bottlecms-input="" type="hidden" name="orderBy" th:value="${reqParam.orderBy}">
                    <div class="content-block">
                        <nav bcui-popform="" class="handle-list" style="padding-top: 60px;border:none;">
                            <div class="list-item gender" style="border:none">
                                <label class="radio-inline c-radio">
                                    <input bottlecms-radio="" type="radio" name="gender" value="1"
                                           th:checked="${reqParam.gender eq 1}"><span
                                        class="fa fa-circle"></span>
                                    <text>男士</text>
                                </label><label class="radio-inline c-radio">
                                <input bottlecms-radio="" type="radio" name="gender" value="2"
                                       th:checked="${reqParam.gender eq 2}"><span
                                    class="fa fa-circle"></span>
                                <text>女士</text>
                            </label>
                            </div>

                            <div class="list-item enter" form-item-max="80" form-item-min="18" form-item-name="age"
                                 form-item-type="range" form-item-unlimited="不限"
                                 th:attr="form-item-value=${reqParam.age}">
                                <input bottlecms-input="" type="hidden" name="age" th:value="${reqParam.age}">
                                <div class="item-title">
                                    年龄
                                </div>
                                <div class="item-info data" th:text="${reqParam.age}">
                                </div>
                            </div>

                            <div class="list-item enter" form-item-name="district" form-item-type="district"
                                 form-item-unlimited="不限" th:attr="form-item-value=${reqParam.district}">
                                <input bottlecms-input="" type="hidden" name="district" th:value="${reqParam.district}">
                                <div class="item-title">
                                    区域
                                </div>
                                <div class="item-info data" th:text="${reqParam.districtCn}">
                                </div>
                            </div>
                        </nav>

                        <div style="height: 4rem;"></div>
                    </div>
                    <div class="btnbox">
                        <button class="btn submit" type="submit">
                            搜索
                        </button>
                        <a class="btn btn-invalid reset" href="/m/voice?">
                            清除
                        </a>
                    </div>
                </form>
            </div>
        </div>
    </div>


    <div th:replace="layout/m_layout::m_top_menu"></div>
    <div th:replace="layout/m_layout::systemJs"></div>

    <script type="text/javascript" src="/m/js/category.js"></script>
    <script type="text/javascript" src="/m/js/category_district.js"></script>
    <script id="javascript-bottlecms-popform" src="/m/js/bottlecms-popform.js" type="text/javascript"></script>
    <script type="text/javascript">
        // 加载最新单身列表

        var thisload = bottlecms.load({
            done: function (page, next) {
                var search = $('#search').serializeArray();
                bottlecms.get("/m/ajax/video/list?page=" + page, search, function (data) {
                    var lis = [];
                    for (var o in data.list) {
                        lis.push(voices_template(data.list[o]))
                    }
                    next(lis.join(''), lis.length);
                })
            }
        });
        thisload.load();

        //初始化popform
        bottlecms.popform.init();


    </script>

</div>
</html>
